<template>
  <div id="list">
    <Myheader :page="page"></Myheader>
    <!--<myheader></myheader>-->
    <myflow :stepindex=2></myflow>
    <div class="groupWarp" v-show="!showLoading">
      <group>
        <cell v-for="event in eventList" :key="event.id" :title=event.name link="/disclaimer"
              :disabled="!getState1(event)"
              :inline-desc="getState(event)"
              @click.native="setProject(event.name,event.id,raceid)"></cell>
      </group>
    </div>
    <loading :show='showLoading'></loading>
  </div>
</template>


<script type="text/ecmascript-6">
  /* eslint-disable*/
  const STARTSTR = '进行中'  //进行中提示
  const ENDSTR = '已经结束'     //结束提示
  const UNSTARTSTR = '尚未开始' //尚未开始提示
  import mixin from '@/common/js/mixin.js'
  import Myflow from '@/common/components/myflow.vue'
  import {Group, Cell} from 'vux'
  import Loading from '@/common/components/loading.vue'
  import Myheader from "@/common/components/myheader.vue"

  // 获取项目列表
  import qs from 'qs'
  import {axios} from '@/api/axios.js'
  import {indexedDB} from "@/api/indexedDB.js";

  //自定义方法
  import {dateStringToDateTime} from '@/common/js/main.js'

  export default {
    props: ['page', 'host'],
    data () {
      return {
        eventList: [],
        timeDate: '',
        statusType: STARTSTR,
        showLoading: false,
        raceid: '',
        ke: '',
        inviteCode: ''
      }
    },
    created () {

      //获取邀请码
      indexedDB('invite', 'get', this.RACEID, '', (a) => {
        if(!!a){
          this.inviteCode = a.invitationCode
          this.inviteEventId = a.invitationEventId
        }
      })


      this.raceid = this.page.raceid;
      if (this.$route.query.dataType == 'show') {
        this.axios.post(`${window.host}race/events`, qs.stringify({
          raceid: this.page.raceid,
          ke: this.page.ke
        })).then((response) => {
          if (response.data.code == '200') {
            this.eventList = response.data.data;
          }
        })
      } else {
        // 获取赛事列表
        this.axios.post(`${window.host}race/events`, qs.stringify({
          raceid: this.page.raceid,
          ke: this.page.ke
        })).then((response) => {
          if (response.data.code == '200') {
            this.eventList = response.data.data;
          }
        })
      }
      this.timeDate = new Date().valueOf()
    },
    methods: {
      // 设置报名信息
      setProject(projectName, id, raceid){
        //写入project,
        indexedDB('project', 'set', this.RACEID, projectName, function (a) {
        });
        indexedDB('eventId', 'set', this.RACEID, id, function () {
        });
      },
      getState (a) {

        let startDate = dateStringToDateTime(a.reg_begin) || null
        let endDate = dateStringToDateTime(a.reg_end) || null

        if (typeof(this.inviteCode) !== 'undefined' && this.inviteEventId == a.id) {
          return '报名中(正在使用邀请码报名)'
        }



        if (!a.reg_begin && !a.reg_end) {
          //没有开始时间 没有结束时间  不设置限制
          if (a.state == 'audit') {
            return '报名中，需要审核';
          } else if (a.state == 'draw') {
            return '报名中，需要抽签';
          } else if (a.state == 'normal') {
            if (a.remain <= 0) {
              if (a.allow_wait == 0) {
                return '已经报满了';
              } else if (a.allow_wait = 1) {
                return '候补中，有 ' + a.wait_count + ' 人在候补';
              }
            } else {
              return '报名中'
            }
          }

          return STARTSTR
        } else if (!a.reg_begin && a.reg_end) {
          //只有结束时间
          if (this.timeDate >= endDate) {
            //大于结束时间 返回已经结束
            return ENDSTR
          } else {
            //小于结束时间 返回进行中
            if (a.state == 'audit') {
              return '报名中，需要审核';
            } else if (a.state == 'draw') {
              return '报名中，需要抽签';
            } else if (a.state == 'normal') {
              if (a.remain <= 0) {
                if (a.allow_wait == 0) {
                  return '已经报满了';
                } else if (a.allow_wait = 1) {
                  return '候补中，有 ' + a.wait_count + ' 人在候补';
                }
              } else {
                return '报名中'
              }
            }

            return STARTSTR
          }
        } else if (a.reg_begin && !a.reg_end) {
          //只有开始时间
          if (this.timeDate >= startDate) {
            //大于开始时间 返回进行中
            if (a.state == 'audit') {
              return '报名中，需要审核';
            } else if (a.state == 'draw') {
              return '报名中，需要抽签';
            } else if (a.state == 'normal') {
              if (a.remain <= 0) {
                if (a.allow_wait == 0) {
                  return '已经报满了';
                } else if (a.allow_wait = 1) {
                  return '候补中，有 ' + a.wait_count + ' 人在候补';
                }
              } else {
                return '报名中'
              }
            }

            return STARTSTR

          } else {
            //小于开始时间 返回还未开始
            return UNSTARTSTR
          }
        } else if (a.reg_begin && a.reg_end) {
          //正常状态，有开始和结束时间
          if (this.timeDate >= endDate) {
            return ENDSTR

          } else if (this.timeDate <= startDate) {
            return UNSTARTSTR
          }
        }
      },
      getState1 (a) {
        if (typeof(this.inviteCode) !== 'undefined' && this.inviteEventId == a.id) {
          return true
        } else if (a.reg_able) {
          return true
        } else {
          return false
        }
      }
    },
    components: {
      Myflow,
      Group,
      Cell,
      Loading,
      Myheader
    }
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less" rel="stylesheet/less">

</style>








